<div class="wrapper">

    {{menu}}

    <section class="content">
        <div>
            <div class="container-fluid">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="view-header">
                            <div class="header-title" style="float:left;">
                                <h3 class="m-b-xs">View report</h3>
                                <small>View all information about a report.</small>
                            </div>
                            <div class="search hidden-xs" style="margin-top: 15px;width: 345px;float:right;">
                                {{searchBar[]}}
                            </div>
                        </div>
                        <hr>
                    </div>
                </div>

                <div class="row">
                    <div class="col-lg-12">
                        <div class="panel panel-filled">
                            <div class="panel-heading">Information</div>
                            <div class="panel-body">
                                <div>
                                    <table class="table report">
                                        <thead>
                                        <tr>
                                            <td width=150px>URL</td>
                                            <td>{{report[uri]}}</td>
                                        </tr>
                                        <tr>
                                            <td>IP</td>
                                            <td>{{report[ip]}}</td>
                                        </tr>
                                        <tr>
                                            <td>Referer</td>
                                            <td>{{report[referer]}}</td>
                                        </tr>
                                        <tr>
                                            <td>Payload</td>
                                            <td>{{report[payload]}}</td>
                                        </tr>
                                        <tr>
                                            <td>User Agent</td>
                                            <td>{{report[user-agent]}}</td>
                                        </tr>
                                        <tr>
                                            <td>Cookies</td>
                                            <td>{{report[cookies]}}</td>
                                        </tr>
                                        <tr>
                                            <td>Local Storage</td>
                                            <td>{{report[localstorage]}}</td>
                                        </tr>
                                        <tr>
                                            <td>Session Storage</td>
                                            <td>{{report[sessionstorage]}}</td>
                                        </tr>
                                        <tr>
                                            <td>DOM</td>
                                            <td style="padding-right:0px"><textarea
                                                    spellcheck=false>{{report[dom]}}</textarea></td>
                                        </tr>
                                        <tr>
                                            <td>Origin</td>
                                            <td>{{report[origin]}}</td>
                                        </tr>
                                        <tr>
                                            <td>Time</td>
                                            <td>{{report[time]}}</td>
                                        </tr>
                                        <tr>
                                            <td>Screenshot</td>
                                            <td><img onerror="this.parentElement.innerHTML = '';"
                                                     src="/assets/img/report-{{report[screenshot]}}.png"></td>
                                        </tr>
                                        </thead>
                                    </table>

                                    <button class="btn delete" report-id="{{report[id]}}">Delete</button>
                                    <button class="btn archive" report-id="{{report[id]}}">Archive</button>
                                    <button class="btn share" data-target="#shareModal" data-toggle="modal"
                                            report-id="{{report[id]}}" share-id="{{report[shareid]}}">Share
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <div class="modal fade" id="shareModal" role="dialog">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button class="close" data-dismiss="modal" type="button">&times;</button>
                    <h3 class="m-b-xs">Share</h3>
                    <small>Share your reports using direct link or with other ezXSS users</small>
                </div>
                <div class="modal-body">
                    <div id="alert"></div>
                    <form class="form" id="share-report">
                        {{csrf[]}}
                        <input hidden id="reportid" type=hidden value="0">

                        <div class="form-group">
                            <label class="control-label" for="domain">Direct share link</label>
                            <input class="form-control" id="shareid" type="text" value="">
                        </div>

                        <hr>

                        <div class="form-group">
                            <label class="control-label" for="domain">Domain</label>
                            <input class="form-control" id="domain" name="domain" type="text" value="">
                        </div>
                        <button class="btn">Share</button>
                    </form>
                </div>
                <div class="modal-footer">
                    <button class="btn" data-dismiss="modal" type="button">Close</button>
                </div>
            </div>
        </div>
    </div>

    <script type="text/javascript">
        var csrf = "{{csrf[true]}}";
    </script>

</div>